let  productsList = []

// 引入公共头
$(function () {
    $('.header-common').load('../pages/header.html')
})
// 引入公共脚
$(function () {
    $('.footer-common').load('../pages/footer.html')
})

/**
 * 去首页
 */
function toIndex(){
    $('.nav>li:nth-child(1)').click(function(){
        location.href = 'index.html'
    })
}
toIndex()
/**
 * 返回顶部
 */
 window.onscroll = function () {
    toTop()
}
function toTop() {
    if (document.body.scrollTop >= 600 || document.documentElement.scrollTop >= 600) {
        $('.toTop').css('display', 'block')
    } else if (document.body.scrollTop < 600 || document.documentElement.scrollTop < 600) {
        $('.toTop').css('display', 'none')
    }

    $('.toTop').click(function () {
        document.body.scrollTop = 0
        document.documentElement.scrollTop = 0
    })
}

/**
 * 页面数据获取
 */
function getList(){

    // 商品列表数据获取
    $.ajax({
        type: "get",
        url: "http://www.xiongmaoyouxuan.com/api/sub_column/7/items",
        headers: { 'x-platform': 'pc' },
        // data: {
        //     start: pageNo * 20
        // },
        success: function (data) {
            if (data.code = 200) {
                // products = data.data.list 
                let products = data.data.list
                listShow(products)
                console.log('products获取：',products)
                // console.log('商品获取成功', data)
            } else {
                console.log('商品接口连接出现错误', data)
            }
        }
    })

    // 子菜单数据获取
    $.ajax({
        type: "get",
        url: "http://www.xiongmaoyouxuan.com/api/column/29",
        headers: { 'x-platform': 'pc' },
        success: function (data) {
            if (data.code = 200) {
                let navList = data.data.subColumns
                navShow(navList)
                // console.log('navList获取：',navList)
                // console.log('子菜单获取成功', data)
            } else {
                console.log('商品接口连接出现错误', data)
            }
        }
    })

}
getList()


/**
 * 子菜单数据渲染
 * @param {*} navList 
 */
function navShow(navList){
    let str = ''
    navList.forEach(item => {
        str += `
        <li>${item.name}</li>  
    `
    });
    $('.bannerNav').html(str)
}

/**
 * 商品展示数据渲染
 * @param {*} list 
 */
function listShow(list){
    let str = ''
    productsList =[
        ...productsList,
        ...list
    ]
    productsList.forEach(item => {
        str += `
        <div class="product" index="${item.id}">
            <img src="${item.image}" alt="商品图" class="pro_img">
            <div class="details">
                <div class="pr_desc">${item.title}</div>
                <div class="pr_plat">
                    <div class="operator">${item.platform == 2 ? "淘宝" : "天猫"}</div>
                    <p>${item.type == 1 ? "包邮" : "不包邮"}</p>
                </div>
                <div class="pr_discount">
                    <span class="price">￥<span class="point"><span class="int">${parseInt(item.price)}</span>.${cutStr(item.price.toString())}</span><span
                            class="buy">${item.saleNum}人已买</span></span>
                    <div class="ticket">${item.couponValue}</div>
                </div>
            </div>
        </div>
            `
    })
    $('.nineNine_content').html(str)
}

/**
 * 点击获得更多商品信息
 */
 function moreList() {
    let pageNo = 0
    $('.more_btn').click(function () {
        pageNo++
        console.log(pageNo)
        $.ajax({
            type: "get",
            url: "http://www.xiongmaoyouxuan.com/api/sub_column/7/items",
            headers: { 'x-platform': 'pc' },
            data: {
                start: pageNo * 20
            },
            success: function (data) {
                if (data.code = 200) {
                    products = data.data.list 

                    console.log('products获取：',products)
                    listShow(products)
                    // console.log('获取成功', data)
                } else {
                    console.log('出现错误', data)
                }
            }
        })
    })
}
moreList()

/**
 *监听 查看商品详情 点击事件 获取商品详情
 */
 function clickProduct() {
    $('.nineNine_content').on('click', '.product', function () {
        let id = $(this).attr('index')
        // let index = products.findIndex(item => item.id == id)
        $.ajax({
            type: "get",
            url: "http://www.xiongmaoyouxuan.com/api/detail",
            data: {
                id,
            },
            headers: {
                'x-platform': 'pc',
            },
            success: function (data) {
                if (data.code = 200) {
                    localStorage.setItem('product', JSON.stringify(data))
                    location.href = './productDetails.html'
                } else {
                    console.log('详情获取出现错误', data)
                }
            }
        })
    })
}
clickProduct()

/**
 * 取价格的小数部分
 * @param {} str 
 * @returns 
 */
 function cutStr(str) {
    let newArr = str.split('.')
    return newArr[1]
}